
<html>
<head>
<script src="java/jquery-1.4.2.min.js"></script>
<script src="java/myfunctions.js"></script>
</head>
 
<body>
 
    <h1>Simple Search</h1> 
 
    <!-- article inputs -->
    <div class="article" style="margin:10px;">
    	
        <div class="input-prepend">
        	<span class="add-on">Search Option</span>
        	<select id="searchOption" name="searchOption">
                  <option value="20" selected="selected">Keyword</option>
                  <option>Title</option>
                  <option>Subject</option>
                  <option>Author</option>
                  <option>Publisher</option>
                  <option>ISBN</option>
                </select>
        </div>
        <br/>
        <div class="input-prepend">
            <span class="add-on">Search Text</span>
            <input class="span4" id="url" name="url" type="text" placeholder="search books">
        </div>
        <br/>
       
        <p>
            <button class="btn btn-primary" type="button" onclick="sendAjax()">Search</button>
        </p>
    </div>
 
    <!-- display all articles -->
    <div style="width:700px;padding:20px;S">
        <h5 style="text-align:center"><i style="color:#ccc"><small>Search Results</small></i></h5>
 
        <table id="added-articles" class="table" width="691" height="103" border="1">
            <tr>
            <th width="130" bgcolor="#CCCCCC" scope="col">Title</th>
            <th width="104" bgcolor="#CCCCCC" scope="col">Author</th>
            <th bgcolor="#CCCCCC" scope="col">ISBN</th>
            </tr>
        </table>
    </div>
    <p id="displayCount"></p>
</body> 
</html>